<script lang="ts" setup>
import LoginCard from './LoginCard.vue'
import LoginBackground from '@/assets/images/login-bg.jpg'
import LoginLogo from '@/assets/images/login-logo.png'
import { useTheme } from '@/composables/useTheme'

useTheme()
</script>

<template>
  <div
    class="box-border h-[100vh] h-100dvh select-none bg-cover bg-right-bottom pa-4"
    :style="`background-image: url(${LoginBackground})`"
  >
    <img :src="LoginLogo" class="max-w-sm <sm:max-w-full" />
    <main class="mx-auto mt-16 max-w-64 w-full">
      <LoginCard />
    </main>
  </div>
</template>
